<!--
 Licensed to Diennea S.r.l. under one
 or more contributor license agreements. See the NOTICE file
 distributed with this work for additional information
 regarding copyright ownership. Diennea S.r.l. licenses this file
 to you under the Apache License, Version 2.0 (the
 "License"); you may not use this file except in compliance
 with the License.  You may obtain a copy of the License at

 http://www.apache.org/licenses/LICENSE-2.0

 Unless required by applicable law or agreed to in writing,
 software distributed under the License is distributed on an
 "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 KIND, either express or implied.  See the License for the
 specific language governing permissions and limitations
 under the License.
-->

<div class="wrapper " style="display: none" id="div-all" >
    <div ng-include="'html/main-decorator.html'" ></div>
    <div class="main-panel">

        <div class="content" >
            <div class="container-fluid" >
                <div ng-include="'html/main-topbar.html'" ></div>
                <div class="row">
                    <nav class="navbar navbar-default">
                        <div class="container-fluid">
                            <div class="collapse navbar-collapse">
                                <ul class="nav navbar-nav navbar-right">
                                    <li>
                                        <a  class="dropdown-toggle animated flipInX" data-toggle="dropdown">
                                            <label >Default tablespace</label>
                                            <input type="text" class=" form-control border-input default-tablespace" placeholder="Default tablespace.."  ng-model="defaultTablespace"  ng-keyup="refreshFromKeyUp($event)">
                                            <i alt="ciao" class="ti-reload refresh-icon" ng-click="refresh()"></i>
                                        </a>
                                    </li>
                                </ul>
                                <div class="breadcrumbs" id="breadcrumb">
                                    <a class="navbar-brand maincrumb active" href="" ng-click="refresh('tablespaces')">Tablespaces</a>
                                </div>
                            </div>
                    </nav>
                </div>

                <!--All tablespaces-->
                <div class="row row-div" id="div-tablespaces">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="header">
                                <h4 class="title">Table spaces</h4>

                                <div class="content table-responsive table-full-width">
                                    <table id="table-tablespaces" class="display table" >
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>


                <!--Single tablespace page-->
                <div id="div-tablespace" class="row-div" style="display: none">
                    <div class="row" >
                        <div class="col-md-12">
                            <div class="card">
                                <div class="header">
                                    <h4 class="title">Replication status</h4>

                                    <div class="content table-responsive table-full-width">
                                        <table id="table-tablespace-replication" class="display table table-striped tablespace-table" >
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>


                    <div class="row">
                        <div class="col-lg-4 col-sm-4">
                            <div class="card">
                                <div class="content">
                                    <div class="row">
                                        <div class="col-xs-5">
                                            <div class="icon-big icon-warning text-center">
                                                <i class="ti-server"></i>
                                            </div>
                                        </div>
                                        <div class="col-xs-7">
                                            <div class="numbers">
                                                Transactions
                                            </div>
                                        </div>
                                    </div>
                                    <div class="footer show-tablespace-advanced" ng-click="showTransactions(actualTableSpace)">
                                        <hr />
                                        <div class="stats" >
                                            <i class="ti-download"></i> Show transactions
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4 col-sm-4">
                            <div class="card">
                                <div class="content">
                                    <div class="row">
                                        <div class="col-xs-5">
                                            <div class="icon-big icon-success text-center">
                                                <i class="ti-pulse"></i>
                                            </div>
                                        </div>
                                        <div class="col-xs-7">
                                            <div class="numbers">
                                                Stats
                                            </div>
                                        </div>
                                    </div>
                                    <div class="footer show-tablespace-advanced" ng-click="showStats()">
                                        <hr />
                                        <div class="stats" >
                                            <i class="ti-download"></i> See stats
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4 col-sm-4">
                            <div class="card">
                                <div class="content">
                                    <div class="row">
                                        <div class="col-xs-5">
                                            <div class="icon-big icon-danger text-center">
                                                <i class="ti-view-list-alt"></i>
                                            </div>
                                        </div>
                                        <div class="col-xs-7">
                                            <div class="numbers">
                                                Tables
                                            </div>
                                        </div>
                                    </div>
                                    <div class="footer show-tablespace-advanced" ng-click="showTables()">
                                        <hr />
                                        <div class="stats" >
                                            <i class="ti-download"></i> Show {{actualTableSpace}} tables
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                    
                    
                    
                    <div class="row div-tablespace-hiddendata" id="div-tablespace-stats" style="display: none">
                        <div class="col-md-12">
                            <div class="card">
                                <div class="header">
                                    <h4 class="title">Stats</h4>

                                    <div class="content table-responsive table-full-width">
                                        <table id="table-tablespace-stats" class="display table table-striped tablespace-table" >
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row div-tablespace-hiddendata" id="div-tablespace-tables" style="display: none">
                        <div class="col-md-12">
                            <div class="card">
                                <div class="header">
                                    <h4 class="title">Tables</h4>

                                    <div class="content table-responsive table-full-width">
                                        <table id="table-tablespace-tables" class="display table table-striped tablespace-table" >
                                            <thead>
                                                <tr>
                                                    <th>Table</th>
                                                </tr>
                                            </thead>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row div-tablespace-hiddendata" id="div-tablespace-transactions" style="display: none">
                        <div class="col-md-12">
                            <div class="card">
                                <div class="header">

                                    <h4 class="title">Transactions</h4>

                                    <div class="content table-responsive table-full-width">
                                        <table id="table-tablespace-transactions" class="display table table-striped tablespace-table" >
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>


                <!--Single table-->
                <div  id="div-table" class="row-div" style="display: none">
                    <div class="row" >
                        <div class="col-md-12">
                            <div class="card">
                                <div class="header">
                                    <h4 class="title">Metadata</h4>

                                    <div class="content table-responsive table-full-width">
                                        <table id="table-table-metadata" class="display table cell-border" >
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row" >
                        <div class="col-md-12">
                            <div class="card">
                                <div class="header">
                                    <h4 class="title">Indexes</h4>
                                    <div class="content table-responsive table-full-width">
                                        <table id="table-table-indexes" class="display table cell-border" ></table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row" >
                        <div class="col-md-12">
                            <div class="card">
                                <div class="header">
                                    <h4 class="title">Stats</h4>
                                    <div class="content table-responsive table-full-width">
                                        <table id="table-table-stats" class="display table cell-border" ></table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div ng-include="'html/main-footer.html'"></div>
    </div>
</div>
